const HtmlWebpackPlugin = require('html-webpack-plugin');
const path = require('path');

const basePath = __dirname;  // 当前项目的物理路径
console.log(path.join(basePath, "src"),);  // path.join() 把字符串拼接起来

module.exports = {
    // 配置插件选项
    context: path.join(basePath, "src"),  // path.join() 把字符串拼接起来
    // extensions 检测以这些后缀的文件  webpack处理文件
    resolve: {
        extensions: [".js", ".ts", ".tsx"]
    },
    entry: ["./index.tsx"],
    // 出口，打包文件到dist目录下
    output: {
        path: path.join(basePath,"dist"),
        filename: "bundle.js"
    },
    // 模块，找到规则
    module: {
        // 给resolve里的后缀添加规则
        rules: [
            {
                // \. 表示转义，括号里面表示两者都行
                test: /\.(ts|tsx)$/,
                exclude: /node_modules/,  // 排除一下
                // 把ts文件编译成js文件
                loader: 'awesome-typescript-loader',
                // 配置项，用usebable去处理
                options: {
                    // babel 把es6 的东西处理掉  js编译
                    useBabel:true,
                    babelCore: "@babel/core"
                }
            }
        ]
    },
    plugins: [
        new HtmlWebpackPlugin({
            filename: 'index.html',
            template: 'index.html',
            hash: true   // 用一个唯一的hash值去标记就好了
        })
    ]
}